<script setup lang="ts">
import { provide, ref } from 'vue';
import HmButton from './components/HmButton.vue';
import SonCom from './components/SonCom.vue';
const myEvent = (age:number)=>{
  console.log('子组件触发回调','年龄:',age)
}
const myName = (name:string)=>{
  console.log('子组件触发回调','姓名:',name)
}
const totalCount=ref(100)
provide('totalCount',totalCount)
provide('updateTotalCount',(num:number)=>{
totalCount.value+=num
})
</script>

<template>
<h1>我是根组件</h1>
<h1>totalCount:{{totalCount  }}</h1>
<button @click="totalCount++">修改数据++</button>
<SonCom :name="'法外狂徒张三'" :age= 18  @my-event="myEvent" @my-name="myName"/>
<SonCom :name="'法师刘海柱'" :age= 25 @my-event="myEvent" @my-name="myName"/>
<HmButton :text="'登录'">
  <!-- <button>插槽按钮</button> -->
</HmButton>
</template>
<style scoped>

</style>